<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Object的变化监测</title>
</head>

<body>
  <h1>总结</h1>
  <p>Object可以通过Object.defineProperty将属性转换成getter/seter形式来追踪变化。读取get，修改set。</p>
  <p>我们需要在getter中收集有哪些依赖使用了数据。当setter被触发时，去通知getter中收集到的依赖数据发生变化。</p>
  <p>收集依赖需要为依赖找一个存储依赖的地方，为此我们创建了Dep类，它用来收集依赖，删除依赖和向依赖发送消息。</p>
  <p>所谓的依赖就是Watcher。只有watcher触发的getter才会收集依赖，哪个watcher触发了getter，就把哪个getter收集到dep中。当数据发生变化，会循环依赖列表，通知所有watcher。</p>
  <p>watcher的原理是先把自己设置到全局唯一的指定位置（window。target），然后读取数据。因为读取了数据，所以会触发这个数据的getter。</p>
  <p>此外，Observer类，他的作用把一个object中所有的数据（包括子数据）都转换成响应式的，也可以侦测到object中所有数据的变化。</p>
  <script src="./index.js"></script>
</body>

</html>